<template>
  <div class="bg-white my-[10px]">
    <BaseHead v-show="showType == 1" style="border-bottom: 0">
      <div class="w-full flex justify-between items-center">
        <span>预算明细（单位：万元）</span>
        <el-button @click="showType = 2">执行进度</el-button>
      </div></BaseHead
    >
    <BaseHead v-show="showType == 2" style="border-bottom: 0">
      <div class="w-full flex justify-between items-center">
        <span>预算执行进度（单位：万元）</span>
        <el-button @click="showType = 1">预算明细</el-button>
      </div></BaseHead
    >
    <BaseTable v-show="showType == 1">
      <tr>
        <td class="td-name">预算页扫描件</td>
        <td colspan="3" style="width: 87.5%">
          <p v-for="item in fileList" :key="item.fileId" class="my-[5px]">
            {{ item.fileName
            }}<el-link
              type="primary"
              @click="handleDownload(item.fileId, item.fileName)"
              class="ml-[5px]"
              >下载</el-link
            >
          </p>
        </td>
      </tr>
    </BaseTable>
    <el-table
      :data="budgetList"
      class="w-full"
      border
      stripe
      row-key="id"
      default-expand-all
      :tree-props="{ hasChildren: 'hasChild' }"
      show-summary
      v-show="showType == 1"
      :summary-method="summaryFn"
    >
      <el-table-column label="当前预算信息" align="center">
        <el-table-column type="index" label="序号" width="60px" />
        <el-table-column prop="name" label="预算科目" />
        <el-table-column prop="feeRatio" label="经费占比">
          <template #default="{ row }">
            {{ (row.feeRatio ? row.feeRatio : 0) + "%" }}
          </template></el-table-column
        >
        <el-table-column label="当前预算明细" align="center">
          <el-table-column prop="zxMoney" label="专项经费" v-if="zxFee > 0" />
          <el-table-column prop="ptMoney" label="配套经费" v-if="attachFee > 0" />
          <el-table-column prop="lxMoney" label="留校经费" v-if="outFee > 0" />
          <el-table-column prop="wbMoney" label="外拨经费" v-if="outFee > 0" />
          <el-table-column prop="zcMoney" label="自筹经费" v-if="selfProvideFee > 0" />
        </el-table-column>
        <el-table-column label="预算变动记录" align="center" v-if="budgetChangeColumn.length">
          <el-table-column prop="initVal" :label="`${budgetDate} 初始预算`">
            <template #default="{ row }">
              {{ fiexdNumber(row.initVal) }}
            </template>
          </el-table-column>
          <el-table-column
            :prop="item"
            :label="`${formatDate(item, 'YYYY-MM-DD')} 修改`"
            v-for="item in budgetChangeColumn"
          />
        </el-table-column>
      </el-table-column>
    </el-table>
    <el-table
      :data="budgetUseList"
      class="w-full"
      border
      stripe
      row-key="id"
      default-expand-all
      :tree-props="{ hasChildren: 'hasChild' }"
      v-show="showType == 2"
    >
      <el-table-column type="index" label="序号" width="60px" />
      <el-table-column prop="subjectName" label="预算科目" />
      <el-table-column label="留校预算">
        <template #default="{ row }">
          <MoneyLabel :value="row.subjectFee" />
        </template>
      </el-table-column>
      <el-table-column label="执行经费">
        <template #default="{ row }">
          <MoneyLabel :value="row.payoutFee" />
        </template>
      </el-table-column>
      <el-table-column prop="executeRate" label="执行率" width="240">
        <template #default="{ row }">
          <el-progress :text-inside="true" :stroke-width="26" :percentage="row.executeRate" />
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script setup>
import BaseHead from "@/views/project/components/BaseHead.vue";
import BaseTable from "@/views/project/components/BaseTable.vue";
import MoneyLabel from "@/views/project/components/MoneyLabel.vue";
import { budgetDetail } from "@/api/project/zx/lxxm";
import { handleDownload, fiexdNumber } from "@/utils/main";
import { formatDate } from "@/utils/formatTime.js";
const operateId = inject("id");
const showType = ref(1);
const budgetList = ref([]);
const budgetUseList = ref([]); //执行进度
const zxFee = ref(0); //专项经费
const selfProvideFee = ref(0); //自筹经费(拨款)
const outFee = ref(0); //外拨经费
const attachFee = ref(0); //配套经费（学校资助经费）
const fileList = ref([]);
const budgetDate = ref("");
const budgetChangeColumn = ref([]); //预算变更记录表头
const totalFee = computed(() => {
  return zxFee.value + selfProvideFee.value + attachFee.value;
});
//获取预算信息详情
const getBudgetDetail = async () => {
  const params = {
    proId: operateId.value,
  };
  try {
    const res = await budgetDetail(params);
    budgetDate.value = formatDate(res.data.budgetDate, "YYYY-MM-DD");
    budgetList.value = res.data.bizProjectBudgetFeeList || [];
    if (budgetList.value.length && budgetList.value[0].changeTimeHis) {
      //生成预算变动记录表头
      budgetList.value.forEach((item, index) => {
        item.changeTimeHis.split(";").forEach((changeTime) => {
          if (index == 0) {
            budgetChangeColumn.value.push(changeTime);
          }
        });
      });
      //时间升序排序
      budgetChangeColumn.value.sort((a, b) => {
        return new Date(a) - new Date(b);
      });
      //添加预算变动记录属性值
      const updateBudgetList = (budgetList) => {
        for (let i = 0; i < budgetList.length; i++) {
          const changeValues = budgetList[i].changeMoneyHis.split(";");
          budgetList[i].changeTimeHis.split(";").forEach((changeTime, changeIndex) => {
            budgetList[i][changeTime] = fiexdNumber(changeValues[changeIndex], 6);
          });
          if (budgetList[i].children) {
            updateBudgetList(budgetList[i].children);
          }
        }
      };
      updateBudgetList(budgetList.value);
    }
    budgetUseList.value = res.data.budgetExecuteVoList || [];
    const proInitOtherBaseInfoVo = res.data.proInitOtherBaseInfoVo;
    zxFee.value = parseFloat(proInitOtherBaseInfoVo.feeAuthorize);
    selfProvideFee.value = parseFloat(proInitOtherBaseInfoVo.selfProvideFee);
    outFee.value = parseFloat(proInitOtherBaseInfoVo.outFee);
    attachFee.value = parseFloat(proInitOtherBaseInfoVo.attachFee);
    fileList.value = res.data.proInitOtherBaseInfoVo.fileInfos || [];
  } catch (error) {
    console.log(error);
  }
};
//合计方法
const summaryFn = ({ columns, data }) => {
  const sums = [];
  let countTotal = 0;
  columns.forEach((column, index) => {
    if (index == 0) {
      sums[index] = "";
    } else if (index == 1) {
      sums[index] = "合计";
    } else {
      let total = 0;
      data.forEach((item) => {
        total += parseFloat(item[column.property]);
      });
      if (["zxMoney", "ptMoney", "zcMoney"].includes(column.property)) {
        countTotal += total;
      }
      if (index == 2) {
        sums[index] = fiexdNumber(total) + "%";
      } else {
        sums[index] = fiexdNumber(total, 6);
      }
    }
  });
  //如果输入的经费合计等于总经费 则经费占比置为100 防止出现100.1% 这类情况
  if (fiexdNumber(countTotal, 6) == totalFee.value) {
    sums[2] = "100%";
  }
  return sums;
};
onMounted(() => {
  getBudgetDetail();
});
</script>

<style scoped lang="scss"></style>
